"use strict";

/**
 * @auther wtfssd
 * Created by wtfssd on 2017/11/27
 */
import * as React from 'react'

const {View, FlatList, StatusBar} = require('react-native');
const {connect} = require('react-redux');
const NavigationBar = require('react-native-navbar').default;
import {commonProps, commonStyles} from "../../assets/styles/common";
import NavBackButton from "../../component/BackButton";
import Colors from "../../assets/styles/Colors";
import MyText from "../../component/MyText";
import {colleagueList} from "../../assets/data";
import Avatar from "../../component/Avatar";
import {UserProfilePage} from "../../interface/router";
import Request from "../../utils/Request";


const {List} = require('antd-mobile');

class Page extends React.Component<UserProfilePage, any> {
    renderItem = (p) => {
        const item: userItem = p.item;
        return (
            <List.Item thumb={<Avatar source={{uri:Request.checkImageUrl(item.avatar)}} circle={false}/>}
                       arrow='horizontal'>
                <MyText style={{marginLeft:5}}>{item.nickName}</MyText>
                <List.Item.Brief style={{marginLeft:5}}>
                    {`${item.duty||''}在${item.company.address}`}
                </List.Item.Brief>
            </List.Item>
        )
    };
    render() {
        return (
            <View style={[commonStyles.container]}>
                <NavigationBar {...commonProps.navBar}
                               leftButton={<NavBackButton/>}
                               title={{title: '我的同事是', tintColor: Colors.White}}
                />
                <View style={{padding: 3, backgroundColor: Colors.Background}}>
                    <MyText>{this.props.user.colleague.length} 名同事</MyText>
                </View>
                <View style={commonStyles.flex1}>
                    <FlatList data={this.props.user.colleague || []}
                              keyExtractor={(item) => item.id}
                              renderItem={this.renderItem}/>
                </View>
            </View>
        );
    }
}

export default connect(
    ({user}) => ({user})
)(Page);